<template>
<!--index.wxml-->

  <view class="container">
    <view class="list-mine">
      <view class="list-cell">
        <view>姓名</view>
        <input class="weui-input" maxlength="10" @input="getname" placeholder="输入姓名"></input>
      </view>
      <view class="list-cell">
        <view>手机号</view>
        <input class="weui-input" type="number" @input="getphone" maxlength="11" placeholder="输入手机号"></input>
      </view>
      <view class="list-cell">
        <view class="section__title">地址</view>
        <picker mode="region" @change="bindRegionChange" :value="region">
          <view class="picker">
            当前选择：{{region[0]}}，{{region[1]}}，{{region[2]}}
          </view>
        </picker>
      </view>
      <view class="list-cell">
        <view>详细地址</view>
        <input class="weui-input" type="number" @input="getaddress" maxlength="10" placeholder="输入详细地址"></input>
      </view>
    </view>
    <view class="btn-box">
      <button style="width: 320px;" class="btn" @tap="add_join">提交</button>
      </view>
  </view>
</template>

<script>
//index.js
const app = getApp().globalData;
import iCell from "../../components/yhzcell/mycell";
import { addJoinus } from "@/api/setting.js"

export default {
  data() {
    return {
      name: '',
      phone: '',
      province: '',
      city: '',
      address: '',
      region: ['北京市', '北京市', '东城区'],
      customItem: '全部'
    };
  },

  components: {
    iCell
  },
  props: {},
  onLoad: function () {
    uni.setNavigationBarColor({
      frontColor: '#000000',
      backgroundColor: '#FAFFFF'
    });
  },
  methods: {
    getname: function (e) {
      console.log(e);
      this.setData({
        name: e.detail.value
      });
    },
    getphone: function (e) {
      this.setData({
        phone: e.detail.value
      });
    },
    getaddress: function (e) {
      this.setData({
        address: e.detail.value
      });
    },
    bindRegionChange: function (e) {
      console.log('picker发送选择改变，携带值为', e.detail.value);
      this.setData({
        region: e.detail.value
      });
    },
    add_join: function () {
      var _this = this;
	  addJoinus({
		  name: this.name,
		  phone: this.phone,
		  province: this.region[0],
		  city: this.region[1],
		  area: this.region[2],
		  address: this.address
	  }).then(res => {
		  if(res.code == 1){
			  uni.showToast({
			    title: '提交成功',
			    icon: 'success',
			    duration: 2000
			  });
		  }
	  })
      // uni.request({
      //   url: app.post_url + '/api/v1/add_joinus',
      //   //仅为示例，并非真实的接口地址
      //   data: {
      //     name: this.name,
      //     phone: this.phone,
      //     province: this.region[0],
      //     city: this.region[1],
      //     area: this.region[2],
      //     address: this.address
      //   },
      //   method: 'post',

      //   success(res) {
      //     console.log(res);

      //     if (res.data.code == 1) {
      //       uni.showToast({
      //         title: '提交成功',
      //         icon: 'success',
      //         duration: 2000
      //       });
      //     }
      //   }

      // });
    }
  }
};
</script>
<style>
@import "./index.css";
</style>